<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>流程管理 - 已办</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="/lib/layui/css/layui.css" media="all" />
	<script src="/lib/layui/layui.js" charset="utf-8"></script>
	<script src="/static/js/main.js"></script>
	<script src="process.js"></script>

</head>
<body>
<div class="tags" id="tags">
    <input type="text" name="" id="inputTags" readonly="true" autocomplete="off">
</div>
<table class="layui-table layui-form" id="dataList" lay-filter="dataList"></table>

<script>    
    layui.use(['table','configure','configureCom','inputTags'], function () {

    	var userIdsElement = parent.userIdsElement;
    	var userNamesElement = parent.userNamesElement;
    	var selectUserMap = {};

    	//第一步：获取
    	var userIds = userIdsElement.val().split(',');
    	var userNames = userNamesElement.val().split(',');
		userNames.forEach(function(item,index){
			selectUserMap[item] = userIds[index];
		});

    	
        var $ = layui.jquery;
        var configureCom = layui.configureCom;
        var configure = layui.configure;
		var table = layui.table;
    	var inputTags = layui.inputTags;
	    var that = inputTags.render({
	      	elem:'#inputTags',		//定义输入框input对象
	      	content: userNames,		//默认标签
	      	aldaBtn: false ,		//是否开启获取所有数据的按钮
	      	done: function(value){ 	//回车后的回调
	        	console.log(value)
	      	},
	      	close: function(value){
				delete selectUserMap[value];
				console.log(selectUserMap);
	      	}
	    });
	    
	    var selectUser = function(userId,userName){
	    	if(selectUserMap[userName]){
	    		alert("已选中");
	    	}else{
	    		that.config.content=[userName];
	    		inputTags.render(that.config)
				selectUserMap[userName] = userId;
	    	}
	    }

	    parent.set = function(){
	    	var userIds = '';
	    	var userNames = '';
			for(var key in selectUserMap) {
				userNames+=','+key;
				userIds+=','+selectUserMap[key];
			}
			userIds = userIds!=''?userIds.substring(1):'';
			userNames = userNames!=''?userNames.substring(1):'';
			
			if(userIds==''){
				alert('请选择审批人!');
				return;
			}
			userIdsElement.val(userIds)
			userNamesElement.val(userNames);
	    }

	    
        
	    var cols = [[
            {field: 'realName', title: '姓名'},
            {field: 'contact', title: '联系方式'},
            {field: 'orgNo', title: '所在单位'},
            {field: 'createTime', title: '单位类型'},
            {field: 'createTime', title: '职务'},
            {
                field: '', title: '角色', templet: function (d) {
                    var html = '';
                    $(d.roleList).each(function (index, item) {
                        if (!index) {
                            html += item.roleName
                        } else {
                            html += ',' + item.roleName
                        }
                    });
                    return html;
                }
            }
        ]];
        configureCom.tableRender(configure.USER_LIST_HTTP, {}, cols, 'dataList', 10, 'full-200', false);

       	table.on('row(dataList)', function (obj) {
            var data = obj.data;
			selectUser(data.userId,data.realName);
			console.log(selectUserMap);
        });
    });
</script>
</body>
</html>